﻿@using BusinessObjects
@using WebUI.CommonHelper
@model WebUI.Models.NccSearchModel

@*<script src="~/Scripts/jquery-ui-1.8.20.min.js"></script>
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="~/Scripts/plugin/jquery.multiselect.min.js"></script>
<link href="~/Content/jquery.multiselect.css" rel="stylesheet" />*@
<link href="~/Content/multiple-select.css" rel="stylesheet" />
<script src="~/Scripts/plugin/jquery.multiple.select.js"></script>
<style>
    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
        border: 1px solid #B1B1B1;
        background: none repeat scroll 0 0 #FFFFFF;
        color: #154665;
    }

    .ui-corner-all {
        border-radius: 0px;
    }

    .ui-multiselect {
        padding: 0px;
    }
</style>
<script>
    function OnSuccess(data) {
        alert("This is the OnSuccessCallback: " + data);
    }
</script>
@{
    var ajaxOption = new AjaxOptions
                         {
                             LoadingElementId = "loading",
                             InsertionMode = InsertionMode.Replace,
                             HttpMethod = "POST",
                             OnSuccess = "FillData"
                         };

    var routeValues = new
                          {
                              hoten = Model.HoTen,
                              nccSearchModel = Model
                          };
}

@using (Ajax.BeginForm("ListDataJson", "Ncc", ajaxOption))
{
    <div class="ncc-table ncc-toolbar-search">
        <div class="ncc-table-row">
            <div class="ncc-table-cell two-cell" style="padding-right: 10px">
                <div class="ncc-table">
                    <div class="ncc-table-row">
                        <div class="ncc-table-cell lable-cell">@NccDto.Const.HO_TEN
                        </div>
                        <div class="ncc-table-cell">
                            @Html.LabelFor(x => x.HoTen)
                            @Html.TextBoxFor(x => x.HoTen)
                        </div>
                    </div>
                    <div class="ncc-table-row">
                        <div class="ncc-table-cell lable-cell">@NccDto.Const.NAM_SINH
                        </div>
                        <div class="ncc-table-cell">
                            @Html.TextBoxFor(x => x.NamSinh)
                        </div>
                    </div>
                    <div class="ncc-table-row">
                        <div class="ncc-table-cell lable-cell">@QuanHuyenDto.Const.ENTITY
                        </div>
                        <div class="ncc-table-cell">
                            @Html.DropDownList("IdQuanHuyen", @CommonConst.QUAN_HUYEN_ALL)
                            @*<select id="cbbQuanHuyen">
                                <option>Chọn quận/huyện</option>
                                @foreach (var quanhuyen in Model.QuanHuyens)
                                {
                                    <option value="@quanhuyen.Id" selected="none">@quanhuyen.Ten</option>
                                }
                                huyện
                            </select>*@
                        </div>
                    </div>
                    <div class="ncc-table-row">
                        <div class="ncc-table-cell lable-cell">@XaPhuongDto.Const.ENTITY
                        </div>
                        <div class="ncc-table-cell">
                            <select id="IdXaPhuong" name="IdXaPhuong" disabled="disabled">
                                <option>@CommonConst.XA_PHUONG_ALL</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
            <div class="ncc-table-cell two-cell">
                <div class="ncc-table">
                    <div class="ncc-table-row">

                        <div class="ncc-table-cell">
                            @Html.CheckBoxFor(x => x.IsLietSy) Liệt sỹ
                        </div>
                    </div>
                    <div class="ncc-table-row">
                        <div class="ncc-table-cell lable-cell">@NhomNccDto.Const.ENTITY
                        </div>
                        <div class="ncc-table-cell">
                            @Html.ListBox("LstIdNhomNcc", null, new { style = "width: 300px" })
                            @*<select id="ngonvl" multiple style="width: 300px">
                                @foreach (var nhomNcc in Model.NhomNccs)
                                {
                                    <option value="@nhomNcc.Id">@nhomNcc.Ten</option>
                                }
                            </select>*@
                        </div>
                    </div>
                    <div class="ncc-table-row">
                        <div class="ncc-table-cell lable-cell"></div>
                        <div class="ncc-table-cell" style="padding-top: 10px;">
                            <input id="Button1" class="ncc-button" type="submit" value="Tìm kiếm" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
}

<script>
    $().ready(function () {
        $("#LstIdNhomNcc").multipleSelect({
            selectAll: false,
            placeholder: "Chọn nhóm Ncc"
        });

        $('#LstIdNhomNcc').multipleSelect('uncheckAll');

        $('#IdQuanHuyen').change(function () {
            var ddlQuanHuyen = $(this);

            //Choose all
            if (ddlQuanHuyen.val() == "") {
                $("#IdXaPhuong").attr("disabled", true);
            } else {    //Choose one
                //Bind list XaPhuong
                FillXaPhuong(ddlQuanHuyen.val());
            }
        });
    });

    function FillXaPhuong(quanHuyenId) {
        $.ajax({
            type: "POST",
            url: '@Url.Action("GetXaPhuongsByQuanHuyenId", "XaPhuong")',
            data: { quanHuyenId: quanHuyenId },
            cache: false,
            dataType: "json",
            success: function (data) {
                var ddlXaPhuong = $("#IdXaPhuong");
                ddlXaPhuong.html('');
                ddlXaPhuong.append('<option>@CommonConst.XA_PHUONG_ALL</option>');
                for (var i = 0; i < data.length; i++) {
                    ddlXaPhuong.append($("<option />").val(data[i].Id).text(data[i].Ten));
                }
                $("#IdXaPhuong").removeAttr("disabled", true);
            },
            error: function (ex) {
                alert(ex);
            }
        });
    }
</script>

